<script setup lang='ts'>
//导入pinia
import {useUserStore} from '@/stores/users'
import {computed} from 'vue'
//使用pinia
const userStore = useUserStore()

//通过计算属性获取 token 和 userId,获取到了.表示已经登录过了
const login = computed(()=>{
    const result = userStore.token && userStore.userid
    console.log(result);
    return result
})
</script>
<template>
    <van-nav-bar>
        <template #left>
            <RouterLink to="/city">城市</RouterLink>
        </template>
        <template #title>
            <RouterLink to="/search">巴黎欧莱雅,你值的拥有</RouterLink>
        </template>
        <template #right>
            <RouterLink to="/center" v-if="login">我的</RouterLink>
            <RouterLink to="/login" v-else>登录</RouterLink>
        </template>
    </van-nav-bar>
</template>
<style scoped lang='scss'>
.van-nav-bar{
    background-color: #E81B02;
    .van-nav-bar__left{
        a{
            color: #fff;
            font-size:16px;
            font-weight: 700;
        }
    }
    :deep(.van-nav-bar__title){
        width: 70%;
        height:50px;
        background-color: #fff;
        border-radius: 20px;
        a{
            color:#000;
        }
    }
    .van-nav-bar__right{
        a{
            color: #fff;
            font-size:16px;
            font-weight: 700;
        }
    }
}
</style>